<template>
  <div class="quitApproval">
    <div class="contLeft">
      <h2>{{ information.data.username }}申请请假</h2>
      <div class="topTit">
        <img src="@/assets/common/img.jpeg" alt>
        <div class="info">
          <p class="name">
            <strong>{{ information.data.username }}</strong>
          </p>
          <p>
            <span>部门：{{ information.data.departmentId == 1 ? '中德集团' : '总裁办'  }}</span>
          </p>
          <p>
            <span>申请时间： {{ information.data.approvalAdd  }}</span>
          </p>
        </div>
      </div>
      <div class="content">
        <p>
          <span>申请类型：</span>
          {{information.data.processName}}
        </p>
        <p>
          <span>请假类型：</span>
          {{ information.data.leaveName}}
        </p>
        <p>
          <span>申请单位：</span>
          天
        </p>
        <p>
          <span>开始时间：</span>
          {{ information.data.approvalForm  }}
        </p>
        <p>
          <span>结束时间：</span>
          {{ information.data.approvalTo  }}
        </p>
        <p>
          <span>请假时长：</span>
          {{information.data.leaveTime}}
        </p>
        <p>
          <span>申请事由：</span>
          {{ information.data.leaveThings }}
        </p>
      </div>
    </div>
<!--    <div class="contRit">-->
<!--      <div class="topTit">-->
<!--        <strong>审批记录</strong>-->
<!--      </div>-->
<!--      <div class="Items">-->
<!--        <li v-for="(item, index) in taskInstanceOutList" :key="index">-->
<!--          <div class="name" :style="index==taskInstanceOutList.length-1?'border-right:none':''">-->
<!--            <p>{{ item.handleTime | formatDate }}</p>-->
<!--            &lt;!&ndash; <p>{{item.description}}</p> &ndash;&gt;-->
<!--          </div>-->
<!--          <div class="act">-->
<!--            <strong>{{ item.handleUserName }}</strong>-->
<!--            <span v-if="index==0">发起申请</span>-->
<!--            <span v-else-if="item.handleType == '3'">审批驳回</span>-->
<!--            <span v-else-if="item.handleType == '4'">已撤销</span>-->
<!--            <span v-else-if="item.handleType == '1'">未开始</span>-->
<!--            <span v-else-if="item.handleType == '2'">审批通过</span>-->
<!--            <span v-else>审批中</span>-->
<!--          </div>-->
<!--        </li>-->
<!--      </div>-->
<!--    </div>-->
  </div>
</template>

<script>
import { getApprovalsDetail, getApprovalsTaskDetail, downImg } from '@/api/approval'
import {finApprovalById} from "@/api/approval"

export default {
  name: 'UsersTableIndex',
  components: {},
  data() {
    return {
      approvalId: this.$route.params.id,
      information: {
        data: {}
      },
      taskInstanceOutList: [],
      imgs: ''
    }
  },
  created() {
    this.finApprovalById()
    this.getApprovalsTaskDetail()
  },
  methods: {
    async finApprovalById() {
      this.information.data = await finApprovalById(this.approvalId)
      console.log(this.information)
      // this.information.data = JSON.parse(this.information.procData)
    },
    async getApprovalsTaskDetail() {
      this.taskInstanceOutList = await getApprovalsTaskDetail(this.approvalId)
    },
    // 图片下载
    async getReviewHistory(id) {
      const response = await downImg(id)
      this.imgs = 'data:image/png;base64,' + btoa(
        new Uint8Array(response.request.response).reduce((data, byte) => data + String.fromCharCode(byte), '')
      )
    }
  }
}
</script>
